<template>
    <div>
        <!--面包屑导航-->
        <div class="breadcrumb">
            <div class="container">
                <h2>
                    <a href="">首页</a>&gt;<a href="">公司动态</a>
                </h2>
            </div>
        </div>
        <!--页面主体-->
        <div class="main container">
            <div class="news">
                <ul>
                    <!--<li><span>2016-02-21</span><a href="">空气净化器要逆天？ “玫瑰金”“土豪金”齐上阵</a></li>-->
                    <!--<li><span>2016-02-21</span><a href="">净美仕新风净化系统　助力校园新风行动</a></li>-->
                    <!--<li><span>2016-02-21</span><a href="">全国新风行动全面启动 助推净美仕战略升级</a></li>-->
                    <li v-for="page in pager.data">
                        <span>{{page.pubTime}}</span>
                        <a :href="page.nid">{{page.title}}</a>
                    </li>
                </ul>
            </div>
            <!-- 分页导航-->
            <div class="pages">
                <a href="" class="">上一页</a>
                <a href="" class="cur">1</a>
                <a href="">2</a>
                <a href="">3</a>
                <a href="">4</a>
                <a href="">5</a>
                <a href="">下一页</a>
            </div>
        </div>
    </div>
</template>

<script>
export default {
    data() {
        return {
            pager: {}
        }
    },
    // 组件生命周期钩子：加载完成
    mounted() {
        let url = 'http://localhost:3000/news/list/1';
        this.$http.get(url).then(response => {
            //success
            console.log(response);
            this.pager = response.data;
        }, response => {
            // error
            console.log(response);
        });
    }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
